<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button onclick="openWindow()">打开</button>
    <button onclick="closeWindow()">关闭</button>
    <script>
        let myWindow = null
        const openWindow = () => { 
            // window.open()返回一个打开它的窗口的引用，与window没有区别，只是为了便于控制
            myWindow = window.open("http://www.baidu.com", "myWindow", "height=400,width=400") 

            // 新打开的窗口有opener属性，指向打开它的窗口
            console.log(myWindow.opener === window) // true

            // 有的浏览器新建的窗口要在单独进程中，如果要实现与其他窗口通信就无法独立线程运行
            // 可以将opener设置为空，就可以独立线程运行了，但是不能通信了
            // 一旦中断(设为空)就无法恢复
            myWindow.opener = null
        }

        const closeWindow = () => { 
            myWindow.close() // 关闭新打开的窗口

            // 检查窗口是否关闭
            alert(myWindow.closed) // true
        }

        /**
         * 弹窗屏蔽程序
         * 如果浏览器内置程序阻止了弹窗则window.open返回空
         * 浏览器扩展或者其他程序阻止弹窗会报错，应用try/catch包裹
        */

        // 浏览器阻止
        let myWindow2 = window.open("http://www.baidu.com", "myWindow", "height=400,width=400")
        if (myWindow2 == null) {
            alert("弹窗被阻止")
        }

        // 其他程序阻止
        let blocked = false
        try { 
            let myWindow3 = window.open("http://www.baidu.com", "myWindow", "height=400,width=400")
            if (myWindow3 == null) { 
                blocked = true
            }
        } catch(e) { 
            blocked = true
        }
        if (blocked) { 
            alert("弹窗被阻止")
        }
        
    </script>
</body>
</html>